<!-- 采购管理-基础设置-供应商登录设置 -->
<template>
  <div>
    <pageHeader :title="title" :breadCrumb="breadCrumb" :show-back="true">
      <template #buts>
        <a-button type="primary" @click="save">保存</a-button>
        <a-button @click="cancel">取消</a-button>
      </template>
    </pageHeader>
    <div class="login-supplier">
      <div>
        <div class="box_title_box">
          <span class="box_title_box_title">供应商登录账号设置</span>
        </div>
        <a-radio-group direction="vertical" default-value="1">
          <a-radio value="1"
            >系统自动默认供应商登录注册的手机号码为登录账号</a-radio
          >
          <a-radio value="2"
            >系统自动默认供应商登录注册的用户名为登录账号</a-radio
          >
        </a-radio-group>
      </div>

      <div
        :style="{
          marginTop: '30px',
        }"
      >
        <div class="box_title_box">
          <span class="box_title_box_title">供应商登录初始密码设置</span>
        </div>
        <a-space>
          <span>初始密码：</span>
          <a-input allow-clear placeholder="请输入初始密码"></a-input>
        </a-space>
        <div
          :style="{
            marginTop: '20px',
            color: 'red'
          }"
        >
          tips：供应商登录之后，建议修改初始密码，密码长度为8~16位数，不能为纯数字，包含大小写字母。
        </div>
      </div>
    </div>
  </div>
</template>

<script lang="ts" setup>
  import { reactive, ref } from 'vue';

  const title: string = '供应商登录设置';

  const breadCrumb: string[] = [
    '采购管理',
    '供应商管理',
    '基础设置',
    '供应商登录设置',
  ];
</script>

<style scoped lang="less">
  .login-supplier {
    padding: 10px 40px;
    .box_title_box {
      height: 40px;
      background-color: #f5f7fa;
      display: flex;
      margin-bottom: 20px;

      &_title {
        line-height: 40px;
        font-weight: 700;
      }
    }

    .box_title_box::before {
      position: relative;
      top: 50%;
      left: 10px;
      display: inline-block;
      height: 20px;
      width: 5px;
      margin-right: 20px;
      border-radius: 2px;
      transform: translateY(-50%);
      content: '';
      background-color: #4e7cf7;
    }
  }
</style>
